<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%--
  Created by IntelliJ IDEA.
  User: abcc
  Date: 2019/10/2
  Time: 17:32
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <!-- 引入bootstrap框架的样式文件 -->
    <link rel="stylesheet" href="${path}/plugins/bootstrap/css/bootstrap.css" type="text/css">
    <link rel="stylesheet" href="${path}/css/person/focuson.css">
    <link rel="stylesheet" href="${path}/css/person/person.css">
    <script src="${path}/plugins/jquery/jquery.min.js" type="text/javascript"></script>
</head>

<body>
<!--导航-->
<%@include file="../sharedper/nav.jsp"%>


<!-- 主体部分 -->
<div class="container">
    <%--${info}--%>
    <div class="zt-header">
        <div class="zt-headerimg">
            <img src="${sessionScope.info.picfilename }" style="height:160px;width:160px" class="zt-tx">
        </div>
    </div>
    <div class="zt-xheader">
        <span>${sessionScope.user.userName}</span>
        <button type="button" class="btn btn-default" data-toggle="button" style="margin-left: 400px" value="1" onclick="editInfo(this)"> 添加宠物
        </button>
        <%--<button type="button" class="btn btn-default" data-toggle="button" onclick="window.location.href='data.html'"> 个人资料--%>
        <button type="button" class="btn btn-default" data-toggle="button" value="0" onclick="editInfo(this)"> 个人资料
        </button>
        <button type="button" class="btn btn-default" data-toggle="button"> 我的草稿
        </button>
        <br>
        <a data-toggle="collapse" data-parent="#accordion" href="#collapseThree">
            <span class="glyphicon glyphicon-chevron-down" style="line-height: 40px;">&nbsp;更多资料信息</span></a>
        <div id="collapseThree" class="panel-collapse collapse">
            <table width="400">
                <tr>
                    <td>个人简介</td>
                    <td>${sessionScope.info.uStatement}</td>
                </tr>
                <tr>
                    <td>所在地</td>
                    <td>${sessionScope.info.province}&nbsp;${sessionScope.info.city}&nbsp;${sessionScope.info.district}</td>
                </tr>
                <tr>
                    <td>性别</td>
                    <c:if test="${sessionScope.info.uSex==0}">
                        <td>男</td>
                    </c:if>
                    <c:if test="${sessionScope.info.uSex==1}">
                        <td>女</td>
                    </c:if>
                </tr>
                <tr>
                    <td>注册时间</td>
                    <%--<td>${sessionScope.info.uLogintime}pattern="yyyy-MM-dd HH:MM:ss"</td>--%>
                    <td>
                        <fmt:formatDate value="${sessionScope.info.uLogintime}" pattern="yyyy-MM-dd HH:MM:ss"/></td>
                </tr>
            </table>
        </div>
    </div>
</div>

<div class="container" style="width: 1015px">
    <%--<div class="pet-list">--%>
    <%--<span>我的宠物:</span>--%>
    <%--<ul>--%>
    <%--<c:forEach items="${requestScope.petlist}" var="pet" >--%>
    <%--<li>--%>
    <%--<a href='${path}/edit/pet/${pet.pId}'><img src="${pet.picurl}" alt=""></a>--%>
    <%--<span style="color: #999;--%>
    <%--font-size: 12px;">${pet.pName}</span>--%>

    <%--</li>--%>
    <%--</c:forEach>--%>
    <%--</ul>--%>
    <%--</div>--%>


    <div class="col-sm-6 col-md-9" style="margin-top: 20px;background-color: #fff;margin-bottom: 5px;">
        <p class="guan gactive" id="coll1">收藏的帖子</p>
        <%--<p class="guan" id="coll2">收藏的新闻</p>--%>
        <p class="guan" id="coll3">收藏的商品</p><br>

        <%--<div id="collPage">--%>
        <div id="col1">
            <c:forEach items="${requestScope.collpost}" var="post">
                <div id="${post.postId}s">
            <div class="xztleft">
            <a href="${path}/com/comment?postId=${post.postId}" class="xztlefta" style="margin-top: 10px">${post.title}</a>
                <p style="float: right;margin-top: 5px;margin-right: 5px;">
                    <button type="button" class="btn btn-default btn-sm" onclick="delcollpost(${sessionScope.user.id},${post.postId})">取消收藏</button>
                </p>
            <br>
            <br>
            </div>
            <a href="#" class="xztlefta1" style="color: #999;">
            ${post.postContent}</a>

            <p style="margin-top: 4px;line-height: 12px;">
            <span class="glyphicon glyphicon-thumbs-up" style="color: #999;"></span>
            <span style="margin-right: 10px;font-size: 12px;margin-left: 0px;color: #999">${post.pointNum}</span>
            <span class="glyphicon glyphicon-comment" style="color: #999;"></span>
            <span style="margin-right: 10px;font-size: 12px;margin-left: 0px;color: #999">${post.visitNum}</span>
            <span style="float: right;font-size: 13px;color: #999;text-align: right"><fmt:formatDate value="${post.ptime}" pattern="yyyy.MM.dd HH:MM:ss"/></span>
            </p>
            <hr class="hrLine" style="width:100%;" />
                </div>
            </c:forEach>
        </div>
        <div id="col3" style="display: none">
        </div>
        <%--</div>--%>

    </div>


    <!-- 右边 -->

    <div class="col-md-3 " style="margin-top: 20px;">
        <div class="card" style="background-color: #fff;">
            我的成就
        </div>

        <div style="padding: 12px 0; color: #646464;background-color: #fff;">
            <div style="padding: 6px 20px;">
                                <span class="glyphicon glyphicon-thumbs-up">
                                    获得了${sessionScope.info.myzanNum}个赞
                                </span>
            </div>
            <div style="padding: 6px 20px;">
                                <span class="glyphicon glyphicon-comment">
                                    获得了${sessionScope.info.commentNum}个评论
                                </span>
            </div>
        </div>

        <div class="card" style="align-items:unset;padding-left: 0px;">
            <div style="display: flex;padding: 12px 0;">
                                <span class="input-group-btn">
                                    <button class="btn btn-default" type="button" style="width: 110px;height:85px" onclick="act(0)">
                                        关注了${sessionScope.info.foucNum}人
                                    </button>
                                    <button class="btn btn-default" type="button" style="width: 110px;height:85px" onclick="act(1)">
                                        粉丝${sessionScope.info.fansNum}人
                                    </button>
                                </span>

            </div>
        </div>
        <div style="background-color: #fff;margin-top: 5px">
            <a href="#" class="list-group-item">积分${sessionScope.info.uClass}</a>
            <a href="#" class="list-group-item">收藏</a>
            <a href="${path}/info/focu/${sessionScope.user.id}" class="list-group-item">发布</a>
        </div>
    </div>
</div>
</div>
<%--目的是为了让外部的is灵活使用项目的上下文路径--%>
<input type="hidden" value="${path}" id="path">

<!--引入bootstrap的js文件-->
<script src="${path}/plugins/bootstrap/js/bootstrap.js"></script>
<script src="${path}/plugins/layui/layui.all.js"></script>
<script src="${path}/js/person/person.js"></script>
<script type="text/javascript">
    window.onload=function(){
        $("#col3").load("${path}/info/coll",{id:${sessionScope.user.id}});
    }


    function delGoods(id,kindId) {
        $.post("${path}/del/goods/"+id+"/"+kindId,{id:id,kindId:kindId},function (data) {
            layer.msg('取消成功!!',{
                btn:['我知道了']
            });
            $("#"+kindId).attr("style","display:none;");
        });
    }
    function delcollpost(id,kindId) {
        $.post("${path}/del/collpost/"+id+"/"+kindId,{id:id,kindId:kindId},function (data) {
            layer.msg('取消成功!!',{
                btn:['我知道了']
            });
            $("#"+kindId+"s").attr("style","display:none;");
        });
    }
</script>

</body>
</html>
